<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> 
<title></title> 
<style>
body,div,p{font-size:12px;font-family:Verdana, Geneva, sans-serif, "宋体";margin:0px;padding:0px;overflow:hidden;}
.clear{clear:both;}
ul,li{list-style:none;margin:0px;padding:0px;}

 
#header{height:72px;width:100%;background:url(images/body_background.png);}

#navMenu{float:left;width:200px;height:auto;margin-top:0px;}
#menuTop{width:200px;height:47px;line-height:47px;background:url(images/sprite.png);}
#menu_logout{display:inline-block;width:88px;height:34px;margin:8px 0px 0px 9px;background:url(images/sprite.png) -200px 0px;}
#menu_flushcache{display:inline-block;width:88px;height:34px;margin:8px 0px 0px 0px;background:url(images/sprite.png) -200px -72px;}
#menu_center_top{width:200px;height:8px;margin:0px;background:url(images/sprite.png) 0px -55px;}
#menu_center{width:200px;height:534px;margin:0px;background:url(images/sprite.png) -300px 0px;}
.menutab{float:left;width:27px;height:500px;margin:0px 0px 0px 8px;padding:0px;}
.menutab li{background:url(images/sprite.png);height:37px;margin:0px;padding:5px 7px;white-space:normal;font-size:12px;cursor:pointer;}
.menutab .li_selected_tab{width:10px;background:url(images/sprite.png) -2px -100px;}
.menutab .li_unselected_tab{width:10px;background:url(images/sprite.png) -37px -100px;}
.menulist{display:block;float:right;width:150px;height:100%;line-height:22px;margin-right:5px;padding:10px 5px 0px;}
#menu_bottom{width:200px;height:12px;margin:0px;background:url(images/sprite.png) 0px -80px;}

#main{float:right;width:auto;height:50px;margin-right:5px;}
#tabHeader{height:28px;margin:0px;}
#tabHeader li{display:inline-block;width:auto;height:29px;line-height:29px;text-align:center;cursor:pointer;letter-spacing:1px;margin:0px;}
#tabHeader li{*display:inline;*margin-right:3px;overflow:hidden;}
#tabHeader li span{display:inline-block;height:29px;line-height:29px;float:left;}
.main_unselect_tab{color:#fff;}
.main_select_tab{height:28px;line-height:29px;color:#1D78B8;font-weight:bolder;-margin-bottom:-1px;*z-index:99;}
.main_unselect_tab .main_tab_l{width:10px;background:url(images/sprite.png) -90px -100px;}
.main_unselect_tab .main_tab_r{width:10px;background:url(images/sprite.png) -166px -100px;}
.main_select_tab .main_tab_l{width:10px;background:url(images/sprite.png) -90px -130px;}
.main_select_tab .main_tab_r{width:10px;background:url(images/sprite.png) -166px -130px;}
.main_tab_text{display:inline-block;width:auto;}
.main_unselect_tab .main_tab_text{background:url(images/sprite.png) -90px -165px;}
.main_select_tab .main_tab_text{background:url(images/sprite.png) -90px -195px;}
#tabBox{border:1px #1A76B7 solid;*z-index:1;}
#tabBox .text{padding:20px;}

.icon_new{background:url(http://img.gamesite.x/icons/page_new.gif) no-repeat;}
.icon_list{background:url(http://img.gamesite.x/icons/table.gif) no-repeat;}
</style> 
<script type="text/javascript" src="/public/js/global.min.js"></script> 
<script type="text/javascript" src="/public/js/py.js"></script>
<script type="text/javascript"> 
var headerHeight = 0;
$(function(){
	
	/*初始化界面框架大小*/
	headerHeight = $('#header').height();
	setSize();
	$(window).resize(function(){
		setSize();
	});
	/*初始化界面框架大小 end*/
	
	/*设置菜单点击事件*/
	$('.menutab li').click(function(){
		$('.menutab li').attr('class', 'li_unselected_tab');
		$(this).attr('class', 'li_selected_tab');
	});
	
	/*设置菜单链接点击事件*/
	$('.menulist a').click(function(){
		var tabTitle = $(this).text().substring(0, 4);
		var tabid = $PinYin.search1stLetter(tabTitle);
		var url = $(this).attr("href");
		addTab({id:tabid, title:tabTitle, url:url, iframe:true});
		return false;
	});
	
	
	/*初始化标签页*/
/*	addTab({
				id		: "welcome", 
				title	: "欢迎页",
				iframe	: false,
				content	: 'Welcome!!!!!!!!!!!!!!1',
			});*/
	
});
function setSize()
{
	var winHeight = $(window).height();
	var winWidht = $(window).width();
	var mainHeight = winHeight - headerHeight;
	$('#menu_center').height(winHeight - headerHeight - $('#menuTop').height() - $('#menu_bottom').height());
	$('#navMenu').height(mainHeight);
	$('#main').height(mainHeight).width(winWidht - $('#navMenu').width() - 22);
	$('#tabBox').height(mainHeight - $('#tabHeader').height() - 5); 
}
function addTab(config)
{
	var tabHeader = $('#tabHeader');
	$('#tabHeader').append("\n");
	// 添加tab标签
	var tab = $("<li></li>").appendTo(tabHeader);
	var tabs = tabHeader.find('li');
	tabs.removeClass('main_select_tab').addClass('main_unselect_tab');
	tab.removeClass('main_unselect_tab').addClass('main_select_tab');
	// 设置标签ID属性
	if (typeof config.id == 'undefined') {
		config.id = Math.random();
	}
	tab.attr('id', 'tabli-'+config.id);
	tab.attr('tabid', config.id);
	// 设置标签标题内容
	if (typeof config.title == 'undefined') {
		config.title = 'New Tab';
	}
	var tabTitle = '<span class="main_tab_l"></span><span class="main_tab_text">'+config.title+'</span><span class="main_tab_r"></span>';
	tab.html(tabTitle);
	// 添加tab内容块
	var tabBox = $('#tabBox');
	var boxs = tabBox.find('div');
	boxs.hide();
	var box = $('<div></div>').appendTo(tabBox);
	if (typeof config.content != 'undefined') {
		box.html(config.content);
	}
	box.attr('id', 'box-'+config.id);
	if (typeof config.iframe != 'undefined' && config.iframe) {
		box.html('<iframe id="box-iframe-'+config.id+'" name="mainFrame-"'+config.id
					+' scrolling="auto" frameborder="0"  src="'+config.url+'" style="width:100%;height:100%;"></iframe>'
				);
	} else {
		box.addClass('text');
	}
	// tab标签事件
	tab.click(function(){
		var tabid = $(this).attr('tabid');
		tabHeader.find('li').removeClass('main_select_tab').addClass('main_unselect_tab');
		$(this).removeClass('main_unselect_tab').addClass('main_select_tab');
		tabBox.find('div').hide();
		$('#box-'+tabid).show();
	});
}
</script> 
</head>

<body>

<div id="header">
</div>

<div id="navMenu">
    <div id="menuTop">
        <a id="menu_logout"></a>
        <a id="menu_flushcache"></a>
    </div>
    <div id="menu_center">
    
        <ul class="menutab">
            <li class="li_selected_tab">常用</li>
            <li class="li_unselected_tab">内容</li>
            <li class="li_unselected_tab">用户</li>
            <li class="li_unselected_tab">客服</li>
        </ul>
        
        <ul class="menulist">
            <li class="li_selected_tab"><a href="http://www.baidu.com/">添加文章</a></li>
            <li class="li_unselected_tab"><a href="http://www.163.com/">历史单据查询</a></li>
            <li class="li_unselected_tab"><a href="http://www.qq.com/">游戏服务器管理</a></li>
        </ul>
        
    </div>
    <div id="menu_bottom">
    
    </div>

</div>

<div id="main">
	<ul id="tabHeader">
    <li class="main_select_tab" id="tabli-welcome" tabid="welcome"><span class="main_tab_l"></span><span class="main_tab_text">欢迎页</span><span class="main_tab_r"></span></li>
	<li class="main_unselect_tab" id="tabli-lsdj" tabid="lsdj"><span class="main_tab_l"></span><span class="main_tab_text">历史单据查询</span><span class="main_tab_r"></span></li>
	
    </ul>
<!--	<ul id="tabHeader">
    <li class="main_select_tab" id="tabli-welcome" tabid="welcome"><span class="main_tab_l"></span><span class="main_tab_text">欢迎页</span><span class="main_tab_r"></span></li>
	<li class="main_unselect_tab" id="tabli-lsdj" tabid="lsdj"><span class="main_tab_l"></span><span class="main_tab_text">历史单据查询</span><span class="main_tab_r"></span></li>
	<li class="main_unselect_tab" id="tabli-yxfw" tabid="yxfw"><span class="main_tab_l"></span><span class="main_tab_text">游戏服务管理列表</span><span class="main_tab_r"></span></li>
	</ul>-->
    
    <div id="tabBox">
	</div>
</div>

<div class="clear"></div>

</body>

</html>
